﻿<div class="row">
    <div class="large-10 columns">
        <div data-bind="with: pager" id="pagination-top">
            @Html.Partial("Pagination")
            <div class="page-size" data-bind="visible: itemsCount() > 4">
                <div id="page-ppp">Products Per Page</div>
                <select data-bind="integerValue: pageSize">
                    <option value="3">3</option>
                    <option value="5">5</option>
                    <option value="10">10</option>
                    <option value="20">20</option>
                </select>
            </div>
        </div>

        <div data-bind="foreach: products" style="clear: both;">
            @Html.Partial("ProductShortInfo")
        </div>
        <div data-bind="with: pager">
            @Html.Partial("Pagination")
        </div>
    </div>
    <div class="large-2 columns" data-bind="with: $parent.recent">
        @Html.Partial("RecentProducts")
    </div>
</div>
